<!DOCTYPE html>
<html lang="zh-CN">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>
            CRM研发工具箱-JSON格式化高亮工具
        </title>
        <link rel="shortcut icon" href="favicon.png" type="image/x-icon">
        <!-- Bootstrap Core CSS -->
        <link href="base_files/bootstrap.min.css" rel="stylesheet">
        <!-- MetisMenu CSS -->
        <link href="base_files/metisMenu.min.css" rel="stylesheet">
        <link href="base_files/sb-admin-2.css" rel="stylesheet">
        <link href="json_files/jsonFormater.css" rel="stylesheet">
        <!-- Morris Charts CSS -->
        <!-- <link href="/static/v2.0/bower_components/morrisjs/morris.css" rel="stylesheet"> -->
        <!-- Custom Fonts -->
        <link href="base_files/font-awesome.min.css" rel="stylesheet" type="text/css">
  
      
        <link href="base_files/bdsstyle.css" rel="stylesheet" type="text/css">
        <!-- jQuery -->
        <script src="base_files/jquery.min.js"></script>
    </head>

    <body>
        <div id="wrapper">
            <!-- Navigation -->
            <nav class="navbar navbar-default navbar-static-top navbar-fixed-top" role="navigation"
            style="margin-bottom: 0">
                <div class="navbar-header">
                    <a  class="navbar-brand" href="#">
                       CRM工具
                    </a>
                </div>
                <!-- /.navbar-header -->
                <ul class="nav navbar-top-links navbar-left topnav">

                    <li class="dropdown btn-format">
                        <button type="button" class="btn-success">
                            格式化
                        </button>
                    </li>
                    <li class="dropdown btn-clean ">
                        <button type="button" class="btn-warning">
                            清空
                        </button>
                    </li>
                    

                    <li class="dropdown">
                        <a href="time.html" target="_self">
                            Unix时间戳
                        </a>
                    </li>

                    <!-- <li class="dropdown">
                        <a href="" target="_self" class="dropdown-toggle" data-toggle="dropdown">
                            其他工具<i class="fa fa-caret-down"></i>
                        </a>
                        <ul class="dropdown-menu" role="menu">
                            <li>
                                <a href="time.html" target="_self">
                                    Unix时间戳
                                </a>
                            </li>
                        </ul>
                    </li> -->
                </ul>
                <ul class="nav navbar-top-links navbar-right topnav"> 
                    <li>
                        <a id="button-popout" href="#"> 
                                <img src="images/popout.png" width="20" />
                        </a>
                    </li>
                </ul> 
            </nav>
            <!-- Navigation end -->

            <!-- /#page-wrapper -->
            <div id="page-wrapper">
                <div style="height: 10px;">
                </div>
                <div>
                </div>
                <div class="row">
                    <div class="col-lg-12">
                        <div class="panel panel-default">
                            <div class="panel-heading">
                                JSON格式化高亮
                            </div>
                            <!-- /.panel-heading -->
                            <div class="panel-body">
                                <div class="row">
                                    <div class="col-lg-12">
                                        <div class="form-group">
                                            <label>
                                                JSON格式化高亮
                                            </label>
                                            <textarea class="form-control json" rows="5">{"number":1,"array":[],"null":null,"string":"leo108","boolean":true,"obj":{},"level1":{"level2":{"level3":{"level4":{"level5":{"level6":{"level7":{"level8":{}}}}}}}}}</textarea>
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <!-- <div class="col-lg-1">
                                        <button type="button" class="btn btn-outline btn-primary btn-format">
                                            格式化
                                        </button>
                                    </div>
                                    <div class="col-lg-1">
                                        <button type="button" class="btn btn-outline btn-primary btn-clean">
                                            清空
                                        </button>
                                    </div> -->
                                    <div class="col-lg-2">
                                        <div class="form-group">
                                            <label>
                                                缩进
                                            </label>
                                            <label class="radio-inline">
                                                <input type="radio" name="tab" class="tab" value="2">
                                                2
                                            </label>
                                            <label class="radio-inline">
                                                <input type="radio" name="tab" class="tab" value="4" checked="">
                                                4
                                            </label>
                                        </div>
                                    </div>
                                    <div class="col-lg-8">
                                        <div class="form-group">
                                            <input type="checkbox" class="QuoteKeys" checked="">
                                            &nbsp;引号
                                            <input type="checkbox" class="CollapsibleView" checked="">
                                            &nbsp;显示控制&nbsp;&nbsp;&nbsp;&nbsp;
                                            <a href="javascript:;" class="expandAll">
                                                展开
                                            </a>
                                            &nbsp;&nbsp;
                                            <a href="javascript:;" class="collapseAll">
                                                叠起
                                            </a>
                                            &nbsp;&nbsp;
                                            <a href="javascript:;" class="expand" data-level="3">
                                                2级
                                            </a>
                                            &nbsp;&nbsp;
                                            <a href="javascript:;" class="expand" data-level="4">
                                                3级
                                            </a>
                                            &nbsp;&nbsp;
                                            <a href="javascript:;" class="expand" data-level="5">
                                                4级
                                            </a>
                                            &nbsp;&nbsp;
                                            <a href="javascript:;" class="expand" data-level="6">
                                                5级
                                            </a>
                                            &nbsp;&nbsp;
                                            <a href="javascript:;" class="expand" data-level="7">
                                                6级
                                            </a>
                                            &nbsp;&nbsp;
                                            <a href="javascript:;" class="expand" data-level="8">
                                                7级
                                            </a>
                                            &nbsp;&nbsp;
                                            <a href="javascript:;" class="expand" data-level="9">
                                                8级
                                            </a>
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-lg-12">
                                        <div class="Canvas">
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div style="height: 5px;">
                </div>
                <div style="height: 5px;">
                </div>
                <div class="row navbar-fixed-bottom">
                    <div class="col-lg-12">
                        <div class="text-center">
                            Copyright © 2013-2021
                            <a style="color: #CCC;" target="_blank">
                                CRM技术部
                            </a>
                        </div>
                    </div>
                </div>
            </div>
            <!-- /#page-wrapper -->
        </div>
        <!-- /#wrapper -->
        
        <!-- Bootstrap Core JavaScript -->
        <script src="base_files/bootstrap.min.js"></script>
        <script src="json_files/jsonFormater.js"></script>

        <script src="json_files/popup.js">
        </script>
       
</html>